import "./App.css";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
import { useSelector } from "react-redux";
import Login from "./Login";
import NavBar from "./NavBar";
import Dashboard from "./Dashboard";
import TasksPage from "./TasksPage";
import UsersPage from "./UsersPage";
import store from "./store";

function App() {
  const currentUser = useSelector((state) => state.currentUser);
  if (!currentUser) {
    return <Login />;
  }

  return (
    <Router>
      <NavBar />
      <div style={{ marginLeft: "200px", padding: "20px" }}>
        <Routes>
          <Route path="/" element={<Dashboard />} />
          <Route path="/tasks" element={<TasksPage />} />
          <Route path="/users" element={<UsersPage />} />
          <Route path='*' element={<div>Page Not Found</div>}></Route>
        </Routes>
      </div>
    </Router>
  );
}

export default App;
